<template>
  <div class="home">
    <div class="nav-bar">
      <van-nav-bar
        title="聊天"
        left-text="返回"
      
        left-arrow
        bind:click-left="onClickLeft"
        bind:click-right="onClickRight"
      />
    </div>
    <div class="content">
      <keep-alive>
        <router-view />
      </keep-alive>
    </div>
    <van-tabbar active="{{ active }}" bind:change="onChange">
        <van-tabbar-item icon="home-o" @click="chatClick">聊天</van-tabbar-item>
        <van-tabbar-item icon="search" @click="otherClick">其他</van-tabbar-item>
        <van-tabbar-item icon="friends-o">我的</van-tabbar-item>
      </van-tabbar>
  </div>
</template>
  
<script>
export default {
  name: "frame_home",
  data() {
    return {};
  },
  methods: {
    otherClick(){
      this.$router.push({ path: '/other' })
    },
    chatClick(){
      this.$router.push({ path: '/chat' })

    }
  },
};
</script>
  
<style scoped lang="scss" >
.home {
  padding: 0px;
  margin: 0px;
  display: flex;
  height: 100%;
  width: 100%;
  flex-direction: column;
  overflow: hidden;


  .nav-bar {
    width: 100%;
  }

  .content {
    width: 100%;
    padding-bottom: 50px;
    height: 100%;
    overflow: auto;

  }

}
</style>
  